<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
		<title>修改密码</title>
		<link rel="stylesheet" type="text/css" href="../pages/bill/css/common.css" />
		<script src="../pages/bill/js/jquery-1.11.3.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="../pages/bill/layer/layer.js" type="text/javascript" charset="utf-8"></script>
		<style type="text/css">
			.container {
				padding: 0px 20px;
			}
			
			p {
				width: 100%;
				line-height: 32px;
				margin-top: 20px;
				text-align: center;
				overflow: hidden;
			}
			
			p label {
				display: inline-block;
				width: 30%;
				color: #666666;
				text-align: justify;
				text-align-last: justify;
				font-size: 14px;
			}
			
			p input {
				width: 70%;
				height: 32px;
				border: none;
				border-radius: 4px;
				background-color: #f1f1f1;
				padding-left: 10px;
				box-sizing: border-box;
			}
			
			button {
				width: 100%;
				height: 40px;
				margin-top: 40px;
				border: none;
				border-radius: 4px;
				background-color: #689AFF;
				font-size: 16px;
				color: #ffffff;
				font-family: "微软雅黑";
			}
		</style>
	</head>

	<body>
		<div class="container">
			<p><label>输入旧密码：</label><input type="password" name="oldPass" id="oldPass" placeholder="请输入旧密码" /></p>
			<p><label>输入新密码：</label><input type="password" name="newPass" id="newPass" placeholder="请输入新密码" /></p>
			<p><label>确认新密码：</label><input type="password" name="newPass1" id="newPass1" placeholder="请确认新密码" /></p>
			<button id="okBtn">确定</button>
		</div>

		<script type="text/javascript">
			$(function() {
				/**
				 * 获取url中的参数
				 * */
				function getUrlParam(name) {
					var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象
					var r = window.location.search.substr(1).match(reg); //匹配目标参数
					if(r != null) return unescape(r[2]);
					return null; //返回参数值
				}
				var userCode = getUrlParam('id');

				/**
				 * 检查输入内容
				 * */
				function checkInput() {
					var oldPass = $('#oldPass').val(); //获取旧密码的内容
					var newPass = $('#newPass').val(); //获取新密码的内容
					var newPass1 = $('#newPass1').val(); //获取确认新密码的内容

					if(oldPass == '') {
						layer.msg("请输入旧密码");
						return false;
					} else if(newPass == '') {
						layer.msg("请输入新密码");
						return false;
					} else if(newPass1 == '') {
						layer.msg("请输入确认密码");
						return false;
					} else if(newPass != newPass1){
						layer.msg("两次密码输入不一致");
						return false;
					}

					return {
						oldPass: oldPass,
						newPass: newPass,
					}
				}

				/**
				 * 确认按钮点击事件
				 * */
				$('#okBtn').click(function() {
					var res = checkInput();
					if(res) {
						var password = {
							oldPassword: res.oldPass,
							newPassword: res.newPass,
						}
						$.ajax({
							url: "changePassword.thor?id=" + userCode,
							data: password,
							cache: false,
							dataType: 'json', //服务器返回json格式数据
							type: 'POST', //HTTP请求类型
							timeout: 10000, //超时时间设置为10秒；
							success: function(data) {
								console.log(data);
								layer.closeAll('loading');
								if(data == 0){
									layer.msg("修改密码成功");
									setTimeout(function(){
										localStorage.clear();
										sessionStorage.clear();
										window.location.href = "tologin.thor"
									},2000)
								}

							},
							error: function(data) {
								layer.closeAll('loading');
								if(data.readyState == 4) {
									layer.msg(data.responseJSON.exceptionMessage);
								} else {
									layer.msg("网络错误...");
								}

							}
						});
					}
				})
			})
		</script>
	</body>

</html>